<template>
  <van-icon @click="CollectdClick" :color=" Collected? 'red': '#777'" :name="Collected ? 'star' :'star-o'" />
</template>

<script>
import { addArticleClloeced, deleteArticleClloeced } from '@/api/article.js'
export default {
  props: {
    // 父传子
    // value
    Collected: {
      type: Boolean,
      required: true
    },
    arcticleId: {
      type: [Object, Number],
      required: true
    }
  },
  model: {
    prop: 'Collected'
  },
  methods: {
    async CollectdClick () {
      try {
        if (this.Collected) {
          // 已收藏，点击取消
          await deleteArticleClloeced(this.arcticleId)
          console.log(1)
        } else {
          // 未收藏，点击收藏
          await addArticleClloeced(this.arcticleId)
          console.log(2)
        }
        this.$toast('操作成功')
        this.$emit('input', !this.Collected)
      } catch (err) {
        this.$toast('操作失败')
      }
    }
  }
}
</script>

<style>
</style>
